﻿@model dynamic

@{
    ViewBag.Title = "Home";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Home</h2>
<div class="input-append">
    @Html.TextBox("txtCardSearchBar", null, new { placeholder = "Card Name", autocomplete = "off", data_search_url=Url.Action("Card") })
    <button id="btnCardSearchBar" class="btn"><i class="icon-search"></i></button>
</div>

<script type="text/javascript">

    $().ready(function () {
        var $txtCardSearchBar = $('#txtCardSearchBar');

        $txtCardSearchBar.typeahead({
            source: function (query, process) {
                var url = "@Url.Action("Autocomplete", "Administration")";
                $.get(url, { query: query }, function (data) {
                    process(data);
                });

            },
            minLength: 1
        });

        $txtCardSearchBar.on('keypress', function (e) {
            var code = (e.keyCode ? e.keyCode : e.which);
            if (code == 13) {
                $("#btnCardSearchBar").click();
            }
        });

        $('#btnCardSearchBar').on('click', function () {
            if ($txtCardSearchBar.val() != '') {
                window.location.href = $txtCardSearchBar.data('search-url') + "?cardTerm=" + $txtCardSearchBar.val();
            }
        });

    });

</script>
